import ComMenu from '../components/menu'
import { lazy, Suspense, useEffect } from "react"
import { Routes, Route, Navigate, useNavigate } from 'react-router-dom';
import { Layout } from 'antd';
import React from 'react';
import '../static/css/index.css'
const { Header, Footer, Sider, Content } = Layout;
const Shop = lazy(() => import('../views/shop/shop'))
const People = lazy(() => import('../views/people/people.jsx'))
function Index() {
    let Navigate = useNavigate()
    useEffect(() => {
        function uss() {
            if (!sessionStorage.getItem('user')) {
                Navigate('/login')
            }
        }
        uss()
    })

    return (
        <div>
            <Layout>
                <Header className="headerbox">XXX大型后台管理项目</Header>
                <Layout>
                    <Sider >
                        <ComMenu />
                    </Sider>
                    <Content className='content'>
                        <Suspense>
                            <Routes>
                                <Route path='shop' element={<Shop />} ></Route>
                                <Route path='people' element={<People />} ></Route>
                                <Route path='' element={<Navigate to="shop" />} ></Route>
                            </Routes>
                        </Suspense>
                    </Content>
                </Layout>
                <Footer className="headerbox">最终解释权归公子羽所有</Footer>
            </Layout>
        </div>
    )
}
export default Index